﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="BranchNavigation.aspx.cs" Inherits="ZHDJ.Web.Portal.BranchNavigation" %>


<!DOCTYPE html>
<html>
<head runat="server">
    <title></title>
    <link href="../../Resource/themes/default/css/jqtree.css" rel="stylesheet" />
    <link href="../../Resource/themes/default/css/jquery.mCustomScrollbar.css" rel="stylesheet" />
    <%--<script src="../../Resource/js/default/jquery.min.1.12.js"></script>--%>
	<script src="https://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
    <script src="../../Resource/js/jquery/tree.jquery.js"></script>
    <script src="../../Resource/js/jquery/jquery.mCustomScrollbar.concat.min.js"></script>
    <script type="text/javascript">

        var BindTreeClick = function () {
            $('#tree1').bind(
                'tree.click',
                function (event) {
                    var node = event.node;
                    if (node.level !== 0) {
                        $("#branchdaolink").attr("href", "../BranchIndex.aspx?BranchID=" + node.id);
                        $("span", "#branchdaolink").click();
                        window.parent.closeDaoheng();
                    }
                }
            );
        }
        var treePara = {
            closedIcon: $('<img class="fa" src="../../Resource/themes/default/images/Default/triangle1.png" />'),
            openedIcon: $('<img class="fa" src="../../Resource/themes/default/images/Default/triangle2.png" />'),
            selectable: true,
            autoEscape: false,
            autoOpen: 0,
            onCreateLi: function (node, $li) {
                // Add 'icon' span before title
                //$li.find('.jqtree-title').before('<span class="icon"></span>');
            }
        };
        $(function () {


            $('#tree1').tree(treePara);

            BindTreeClick();

            $("#btnSearch").click(function () {
                var dataUrl = "BranchNavigation.aspx?Json=1&Search=" + encodeURI($("#QueryText").val(), "UTF-8");
                $('#tree1').tree('loadDataFromUrl', dataUrl);
            });
            var dd = $(".jqtree-tree[role='tree']");
            dd.eq(0).css({ "height": "0" });
        });

    </script>
    <style>
        body {
            margin: 0 auto;
            font-size: 12px;
            font-family: "宋体", Arial, Helvetica, sans-serif;
            line-height: normal;
            background-repeat: repeat-x;
            background-position: top;
        }
    	.serachbox {
    		overflow: hidden;
			width: 100%;
			height: 34px;
		}
    	.serachbox .mysearchinput {
			float: left;
			width: 261px;
    	}
    	.serachbox .mysearchinput input {
    		width: 249px;
			height:30px;
			line-height: 30px;
			border: solid 1px #d3d3d3;
			padding: 0 5px;
		}
		.serachbox .mysearchbtn {
			float: right;
			width: 60px;
    	}
        .serachbox .mysearchbtn .btn {
            height: 32px;
			line-height: 32px;
			text-align: center;
            width: 50px;
			border: solid 1px #d3d3d3;
			cursor: pointer;
			font-size: 12px;
			color: #333;
			background: #ffffff;
        }
    	.serachbox .mysearchbtn .btn:hover {
    		background: red;
			color: white;
		}
    </style>
</head>
<body>

    <form id="form1" runat="server">
        <div class="serachbox">
            <div class="mysearchinput">
                <input id="QueryText" type="text" />
            </div>
            <div class="mysearchbtn">
                <button type="button" class="btn" id="btnSearch">搜索</button>
            </div>
        </div>

        <div id="mycontent" style="position: relative; height: 310px; width: 330px; overflow: auto;">
            <div id="tree1" data-url="BranchNavigation.aspx?Json=1"></div>
        </div>

        <div style="display: none"><a id="branchdaolink" href="#" target="_blank"><span>33</span></a></div>
    </form>
    <script>
        (function ($) {
			$(window).on("load", function () {
				$("#mycontent").mCustomScrollbar({
					setWidth: false,            
					setHeight: false,          
					setTop: 0,          
					setLeft: 0,
                    autoHideScrollbar: false,
					theme: "dark",
					setLeft: "0",
					axis: "xy"
                });

            });
        })(jQuery);
    </script>
</body>
</html>

